<template>
  <div>
    <!-- 前置弹窗 -->
    <addBeforeDialog ref="addBeforeDialog" @next="nextStep"></addBeforeDialog>
    <!-- 发布页弹窗 -->
    <el-dialog class="add_dialog" :title="title" :visible.sync="dialogVisible" :close-on-click-modal="false" append-to-body fullscreen @close="close" :close-on-press-escape="false">
      <div class="add-edit-box">
        <span class="ceshifont"> </span>
        <div class="flex" v-loading="loading">
          <div class="form-box" @click="boxradioIsShow = ''">
            <el-form ref="form" :model="form" :inline="true" :rules="rules" label-width="80px" class="demo-ruleForm new_form_box">
              <div class=" step-box ">
                <!-- <div style="margin-bottom: 10px;padding-left: 15px" v-if="!isEdit&&AllgameList.length">
                  <el-input placeholder="请输入关键字搜索" suffix-icon="el-icon-search" v-model="keyword" @change="searchGame">
                  </el-input>
                  <el-button style="margin-left: 10px;" type="primary" @click="searchGame">搜索</el-button>
                  <el-button style="margin-left: 10px;" type="primary" plain @click="closeFn('GameSetting')">游戏管理</el-button>
                </div>
                <div class="game-box flex" v-if="!isEdit&&AllgameList.length">
                  <div class="select-game-item" :class="{active:form.gameId==item.id}" v-for="item in gameList " :key="item.id" @click="tabChange(item.id,item)">
                    <div class="img">
                      <img :src="item.icon" alt="">
                      <div class="sign" v-if="GetIsKuaiSu(item.id)">快</div>
                    </div>
                    <div class="gametit">{{ item.name }}</div>
                  </div>
                </div>
                <div style="height: 50px;line-height: 50px;font-size: 20px;text-align: center;" v-if="!isEdit&&AllgameList.length==0">
                  暂未设置游戏， <el-button type="text" style="font-size: 20px;" @click="closeFn('GameSetting')">立即设置</el-button>
                </div> -->
                <!-- <div class="gameInfo" v-if="currentGame&&currentGame.id">
                  <div>
                    <b>游戏名称：</b>
                    <span>{{currentGame.name  }}</span>
                  </div>
                  <div>
                    <b>区服：</b>
                    <span>{{form.qufu  }}</span>
                  </div>
                </div> -->

                <div class="sub-tit">
                  <formSubTitVue :title="'商品信息'" />
                </div>
                <el-form-item v-if="currentGame&&currentGame.id||isEdit" label="游戏名称" prop="gameName">
                  <b>{{form.gameName}}</b>
                </el-form-item>
                <el-form-item v-if="isEdit" label="游戏区服" prop="qufuIds">
                  <el-cascader @change="qufuChange" filterable clearable v-model="form.qufuIds" :options="qufuTree" :props="qufuProps"></el-cascader>
                </el-form-item>
                <el-form-item v-if="currentGame&&currentGame.id&&!isEdit" label="游戏区服" prop="">
                  <b>{{form.qufu}}</b>
                </el-form-item>
                <el-form-item label="商品售价" prop="price" v-if="!fabuJingpai">
                  <el-input v-model="form.price" placeholder="请输入价格" :disabled="isView" />
                </el-form-item>
                <el-form-item label="自编号" prop="thirdId" v-if="!fabuJingpai">
                  <el-input type="text" v-model="form.thirdId" placeholder="自己编写的编号,限20位" maxlength="20" :disabled="isView" />
                </el-form-item>
                <el-form-item label="是否置顶" prop="isTop" v-if="!fabuJingpai&&checkPermi(['goods:list:zhiding'])">
                  <el-radio-group v-model="form.isTop" :disabled="isView">
                    <el-radio :label="1">置顶</el-radio>
                    <el-radio :label="2">不置顶</el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item label="是否自营" prop="ifself" v-if="!fabuJingpai">
                  <el-radio-group v-model="form.ifself" :disabled="isView">
                    <el-radio :label="1">自营</el-radio>
                    <el-radio :label="2">代售</el-radio>
                  </el-radio-group>
                </el-form-item>

                <!-- v-if="form.isAutoImg!=2" -->
                <el-form-item v-if="form.isAutoImg!=2" label="商品标题" prop="title" class="row">
                  <el-input type="textarea" rows="2" v-model="form.title" placeholder="请输入商品标题，最多200个字" maxlength="200" show-word-limit :disabled="isView" />
                </el-form-item>
                <!-- v-if="form.isAutoImg!=2" -->
                <el-row style="background-color: #f8f8f8;margin-bottom: 10px;border-radius: 5px;" v-if="form.isAutoImg!=2">

                  <el-col :span="12">
                    <el-form-item class="row" label="商品首图" prop="titleImg">
                      <el-input v-model="form.titleImg" v-show="false"></el-input>
                      <uploadImageOne v-model="form.titleImg" ></uploadImageOne>


                      <!-- <div class="" :class="{ hiddenupload: titleImgList.length }">
                        <el-input v-model="form.titleImg" v-show="false"></el-input>
                        <el-upload class :action="uploadImgUrl" :file-list="titleImgList" :show-file-list="true" list-type="picture-card" :limit="1" accept="image/png, image/jpeg" :on-success="handleAvatarSuccess" :on-remove="handleAvatarRemove" :http-request="uploadImgs"
                                   :on-preview="handlePictureCardPreview" :disabled="isView" :before-upload="beforeUploadImg">
                          <div class="uploadbg">
                            <img src="https://imgage.maimaihao.com/yuduhulian/erp/static/icon/uploadbg.png" alt="">
                            <br />
                            <span>选择图片</span>
                          </div>
                        </el-upload>
                        <div class="flex alc">
                          <saomaUpload @success="saomaEnd($event,'titleImg')">
                            <el-button style="width:100px" type="primary" plain v-if="!isView">
                              扫码上传</el-button>
                          </saomaUpload>
                          
                        </div>
                      </div> -->
                      <span style="position: absolute;bottom: 0;left: 80px;">
                        <el-button v-if="!isView" type="primary" style="width:100px;margin-left: 10px;" @click="openGetInfoDialog" :loading="makeTitleImgBtnLoading">
                          首图生成</el-button>
                      </span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item class="row" label="上传视频" v-if="!fabuJingpai">
                      <el-upload v-loading="videoLoading" list-type="picture-card" :headers="headers" action="#" :before-upload="beforeUploadVideo" :disabled="isView" :http-request="uploadVideoFn" :on-success="handleVideoSuccess" :limit="1" accept="video/mp4, video/mpeg4" v-if="!form.videoUrl">
                        <div class="uploadbg">
                          <img src="https://imgage.maimaihao.com/yuduhulian/erp/static/icon/uploadbg.png" alt="">
                          <br />
                          <span>选择视频</span>
                        </div>
                      </el-upload>
                      <div class="video-view radius flex" v-if="form.videoUrl">
                        <video controls :src="form.videoUrl"></video>
                        <span v-if="!isView" class="el-icon-delete" @click="handleVideoRemove"></span>
                      </div>
                      <div style="line-height: 26px;" class="colorred font12">视频格式:MP4格式 尺寸比例:16:9;请上传30MB以内的视频</div>
                    </el-form-item>
                  </el-col>
                </el-row>
                <!-- v-if="form.isAutoImg!=2" -->
                <el-form-item v-if="form.isAutoImg!=2" label="详情图片" class="row">
                  <div class="">
                    <!-- 自定义拖拽排序 -->
                    <draggable v-model="imgFileList">
                      <transition-group class="uploader">
                        <div v-for="(item, index) in imgFileList" :key="index" class="upload-list">
                          <img v-if="item.url" style="width: 100%; height: 100%" :src="
                                item.url.indexOf('blob:') > -1
                                  ? item.response && item.response.data
                                    ? item.response.data.filePath
                                    : item.url
                                  : item.url
                              " />
                          <img class="imgs" v-if="item.url" style="width: 30px" src="../../../assets/img/shangchuan.png" alt="" />
                          <div class="icon-container">
                            <span v-if="item.url" @click="handlePreviewNew(index)">
                              <i class="el-icon-zoom-in"></i>
                            </span>
                            <span v-if="item.url &&(!isView||isEdit)" @click="handleRemove(item.url)">
                              <i class="el-icon-delete"></i>
                            </span>
                          </div>
                        </div>
                      </transition-group>
                    </draggable>
                    <el-upload :action="uploadImgUrl" :file-list="imgFileList" list-type="picture-card" :show-file-list="false" :on-preview="handlePictureCardPreview" :on-exceed="uploadNumber" :multiple="true" :drag="true" :before-upload="beforeUploadImg" :on-success="handleUploadSuccess"
                               :limit="100" accept="image/png, image/jpeg" :on-remove="handleRemove" :http-request="uploadImgs" :disabled="isView">
                      <div class="uploadbg">
                        <img src="https://imgage.maimaihao.com/yuduhulian/erp/static/icon/uploadbg.png" alt="">
                        <br />
                        <span>选择图片</span>
                      </div>
                    </el-upload>
                    <!-- <div style="line-height: 26px;" class="colorred font12">
                      注意:使用详情图生成前一定记得完善商品详情信息 否则无效哦!
                        <br />
                      支持JPEG、PNG格式,图片每张小于100M 最多上传80张
                    </div> -->
                    <!-- <el-button style="width:100px" type="primary" plain @click="openPhoneCode" v-if="!isView">
                      扫码上传</el-button> -->
                    <div class="flex alc">
                      <saomaUpload @success="saomaEnd($event,'detailImg')">
                        <el-button style="width:100px" type="primary" plain v-if="!isView">
                          扫码上传</el-button>
                      </saomaUpload>
                      <el-button style="width:150px;margin-left: 10px;" type="primary" @click="getDetailImgs" :loading="makeDetailImgBtnLoading" v-if="!isView&&form.gameId!=7">
                        详情图生成</el-button>
                    </div>
                  </div>
                </el-form-item>
              </div>
              <div class=" step-box ">
                <formSubTitVue :title="'基础信息'" />
                <el-form-item label="账号" prop="accountNumber">
                  <el-input v-model="form.accountNumber" placeholder="请输入账号" :disabled="isView" />
                </el-form-item>
                <el-form-item label="密码" prop="accountPassword" v-if="!fabuJingpai">
                  <el-input v-model="form.accountPassword" placeholder="请输入密码" :disabled="isView" />
                </el-form-item>
                <el-form-item label="手机号" prop="securityPhone" v-if="!fabuJingpai">
                  <!-- <el-input v-model="form.securityPhone" :placeholder="fabuJingpai?'请输入联系电话':'请输入绑定手机号'" maxlength="11" :disabled="isView" @change="phoneNumberChange" /> -->
                  <el-input v-show="false" v-model="form.securityPhone" placeholder="请输入手机号" />
                  <span class="phone-box flex">
                    <span class="name" v-if="form.securityPhone">{{ form.securityPhone }}</span>
                    <template v-if="!isView">
                      <el-button type="text" @click="openSelectPhone">
                        选择
                      </el-button>
                      <el-button style="margin-left: 10px;" v-if="form.securityPhone" type="del" @click="delPhone('phone')">
                        清空
                      </el-button>
                    </template>

                  </span>

                  <!-- <span class="phone-box" v-if="!fabuJingpai">
                    <el-button type="text" @click="openSelectPhone">选择卡位</el-button>
                  </span> -->
                </el-form-item>
                <el-form-item label="成本价" prop="costPrice" v-if="!fabuJingpai">
                  <el-input :controls="false" v-model="form.costPrice" placeholder="请输入成本价" :disabled="isView" />
                </el-form-item>

                <el-form-item class="row" label="其他信息" prop="importantRemark" v-if="!fabuJingpai">
                  <el-input v-model="form.importantRemark" type="textarea" placeholder="可以记录密保信息，采购渠道 包赔信息 卖家信息等，任意重要信息都可以放到此处 方便查找 限制500个字符" :rows="2" :disabled="isView" show-word-limit maxlength="500" />
                </el-form-item>

                <el-form-item label="" prop="" class="row">
                  <div class="upload_img_box flex">
                    <el-form-item label="支付截图" prop="dakuanImg">
                      <uploadImageOne v-model="form.dakuanImg" ></uploadImageOne>
                    </el-form-item>
                    <el-form-item label="二次截图" prop="secondImg">
                      <uploadImageOne v-model="form.secondImg" ></uploadImageOne>
                    </el-form-item>
                    <el-form-item label="钱包截图" prop="walletImg">
                      <uploadImageOne v-model="form.walletImg" ></uploadImageOne>
                    </el-form-item>
                  </div>
                </el-form-item>
                <el-form-item label="其他截图" prop="" class="row">
                  <div class="">
                    <el-upload drag :action="uploadImgUrl" :file-list="otherImgList" :show-file-list="true" list-type="picture-card" :limit="10" :multiple="true" :http-request="uploadImgs" :on-success="otherUploadSuccess" :on-remove="otherImgRemove" :on-preview="handlePictureCardPreview"
                               :on-exceed="uploadNumber2" :disabled="isView">
                      <div class="uploadbg">
                        <img src="https://imgage.maimaihao.com/yuduhulian/erp/static/icon/uploadbg.png" alt="">
                        <br />
                        <span>选择图片</span>
                      </div>
                    </el-upload>
                    <div style="width: 100px;">
                      <saomaUpload @success="saomaEnd($event,'otherImg')">
                        <el-button type="primary" plain>扫码上传</el-button>
                      </saomaUpload>
                    </div>

                  </div>
                </el-form-item>
              </div>
            </el-form>
          </div>
          <!--  v-show="showReleasePage" -->
          <div class="release-page">
            <!-- @back="showReleasePage = false" -->
            <releaseTool :formData="infoData" :isEdit="isEdit" :isView="isView" :isBackGoods="isBackGoods" @openZhongjianDialog="openZhongjianDialog" @submit="getInfoData" @setTitle="setTitle" ref="releaseTool" @attrChange="attrChange" @getAccountInfoEnd="getAccountInfoEnd"></releaseTool>
          </div>
        </div>

        <div class="center">
          <el-button class="font16" plain type="" @click="closeFn('')">关 闭 </el-button>
          <el-button v-if="!isBackGoods&&!isView" class="font16" type="primary" @click="submitForm('form')" :loading="loading">{{!isBackGoods&&isEdit?'确认修改':'确认发布'}} </el-button>
          <el-button v-if="!isBackGoods&&isCanRefresh&&goodsSaleState!==0&&goodsSaleState != 98" class="font16" type="primary" @click="submitForm('form',5)" :loading="loading">修改并刷新 </el-button>
          <el-button v-if="isBackGoods" class="font16" type="warning" @click="submitForm('form',3)" :loading="loading">保 存</el-button>
          <el-button v-if="goodsSaleState===0&&checkPermi(['goods:list:check'])" class="font16" type="danger" @click="jujue" :loading="loading">审核拒绝</el-button>
          <el-button v-if="goodsSaleState===0&&checkPermi(['goods:list:check'])" class="font16" type="success" @click="submitForm('form',6)" :loading="loading">审核通过</el-button>
          
          <el-button v-if="isBackGoods" class="font16" type="primary" @click="submitForm('form',4)" :loading="loading">确认发布</el-button>
        </div>
        <iframe id="xiaosuan" src="https://rpa-sdk.51bees.com/verifyUser.html" style="position: fixed;top: 0;left: 0;width: 100vh;height: 100vh;display: none;
" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"></iframe>

      </div>
    </el-dialog>

    <!-- 营地发布的 中间弹窗 -->
    <el-dialog title="自动获取" :visible.sync="yingdiDialogShow" width="620px" append-to-body>
      <el-form ref="form33" :model="form" :inline="true" :rules="rules33" class="new_form_box">
        <div style="margin-bottom: 10px;">
          <formSubTitVue :title="form.gameName"></formSubTitVue>
        </div>
        <div style="margin-bottom: 10px;" v-if="form.gameId==29">
          请输入掌瓦号快速获取，或者扫码授权获取。
        </div>
        <el-form-item v-if="form.gameId==2" label="" prop="yingdi">
          <el-input v-model="form.yingdi" placeholder="请输入王者营地ID"></el-input>
        </el-form-item>
        <el-form-item v-if="form.gameId==29" label="" prop="yingdi">
          <el-input v-model="form.yingdi" placeholder="请输入掌瓦号"></el-input>
        </el-form-item>
        <!-- 永劫无间   邮箱账号输入账号密码  手机账号输入手机号 -->
        <el-form-item v-if="form.gameId==12&&form.serverId == 55615" label="" prop="accountNumber">
          <el-input v-model="form.accountNumber" placeholder="请输入游戏账号"></el-input>
        </el-form-item>
        <el-form-item v-if="form.gameId==12&&form.serverId == 55615" label="" prop="accountPassword">
          <el-input v-model="form.accountPassword" placeholder="请输入游戏密码"></el-input>
        </el-form-item>
        <el-form-item v-if="(form.gameId==12&&form.serverId == 96543)||(form.gameId==4)" label="" prop="accountNumber">
          <el-input v-model="form.accountNumber" placeholder="请输入登录手机号"></el-input>
        </el-form-item>

        <el-button v-if="(form.gameId==12&&form.serverId == 96543)||(form.gameId==4)" type="primary" :disabled="sendCOde" plain @click="getSmsCode">获取验证码</el-button>
        <br />
        <el-form-item v-if="(form.gameId==12&&form.serverId == 96543)||(form.gameId==4)" label="" prop="smsCode">
          <el-input v-model="smsCode" placeholder="请输入验证码"></el-input>
        </el-form-item>

        <div style="color: #999;user-select: none;" v-if="nextLoading">获取数据预计30s左右，请耐心等待...</div>
        <el-button v-if="form.gameId==29" type="primary" plain @click="yingdiNext" :loading="loading">掌瓦号获取</el-button>
        <el-button v-if="form.gameId==29" type="primary" @click="yingdiNext(2)" :loading="loading">扫码授权</el-button>

        <div style="height: 50px;">

        </div>

        <div class="center">
          <el-button type="primary" @click="yingdiNext" :loading="nextLoading">下一步</el-button>

        </div>
      </el-form>
    </el-dialog>

    <chongzhi ref="chongzhi"></chongzhi>
    <selectPhone ref="selectPhone" @change="getSelectPhone"></selectPhone>
  </div>
</template>

<script>
// import selectBtnVue from "../components/select-btn.vue";
import releaseTool from "./releaseTool.vue";
import formSubTitVue from "@/views/tenantPages/components/formSubTit.vue";

import selectPhone from "./selectPhone.vue";
// import gameConfigApi from "../../../api/gameConfig";
import goodsListApi from "../../../api/gameConfig/goodsList";
import gameListApi from "@/api/gameConfig/gameList";
import makeImgsV3 from "@/utils/makeImgs-v3";
import { getToken } from "@/utils/auth";
import draggable from "vuedraggable";

import chongzhi from "@/views/tenantPages/moneys/components/chongzhijifen.vue";

import { uploadFileFn } from "../../../api/upload";

// 发布前置弹窗
import addBeforeDialog from "./addBeforeDialog.vue";

// 扫码上传组件
import saomaUpload from "../../../components/upload/saomaUpload.vue";
// 自动获取API
import infoApi from "@/api/autoProduction/information.js";

import { getConfigByTenantId } from "../../../api/pickUp/customerService";
// import UPNG from 'upng-js';
export default {
  name: "addGoods",
  components: {
    releaseTool,
    formSubTitVue,
    // selectBtnVue,
    selectPhone,
    draggable,
    chongzhi,
    addBeforeDialog,
    saomaUpload,
  },
  data() {
    var validatePass = (rule, value, callback) => {
      if (!value) {
        callback();
      } else if (!/^1[3-9][0-9]\d{8}$/.test(value)) {
        callback(new Error("手机号不正确!"));
      } else {
        callback();
      }
    };
    var priceReg = (rule, value, callback) => {
      if (!value) {
        callback();
      } else if (!this.priceReg.test(value)) {
        callback(new Error("价格不正确!"));
      } else {
        callback();
      }
    };
    return {
      loading: false,
      isEdit: false,
      isView: false,
      isBackGoods: false,
      infoInputed: false, //是否已填写商品详情
      currentGame: {}, //当前选择的游戏
      showReleasePage: false,
      videoLoading: false,
      nextLoading: false,
      sendCOde: false,
      smsCode: "",
      infoData: {
        isAutoImg: "",
      }, //传到发布工具页面填写的信息
      goodsId: "",

      Times: null,
      // times : null,
      step: 1, //发布账号步骤
      title: "新增游戏账号",
      pushAllList: [],
      pushGroupList: [],
      pushGroup: "", //选择的渠道分组
      checkboxGroup1: [],

      qufuSelect: [],
      qufuList: [],

      dialogVisible: false,
      btnLoading: false,
      makeTitleImgBtnLoading: false,
      makeDetailImgBtnLoading: false,

      roleList: [], //王者荣耀角色列表
      gameList: [], //展示的游戏
      AllgameList: [], //所有游戏
      keyword: "", //筛选游戏的关键字
      // 表单参数
      form: {
        gameId: "",
        title: "",
        gameName: "",
        gameType: "",
        price: "",
        accountNumber: "",
        accountPassword: "",
        securityPhone: "",
        telid: "",
        telnote: "",
        costPrice: "",
        importantRemark: "",
        titleImg: "",
        urlArr: [],
        videoUrl: "",
        thirdId: "",
        isTop: 2,
        ifself: 1,
        isAutoImg: "",
        dakuanImg: "",
        qufuIds: [],
        monitorTaskId: "",
        yingdi: "",
        secondImg: "",
        walletImg: "",
      },
      allData: {}, //接收到的属性信息  编辑时的回显信息
      selectedPhone: "",
      otherImgList: [], //其他截图
      newOtherImages: [], //其他截图
      imgFileList: [],
      titleImgList: [],
      videoList: [],
      ifSpecial: false,
      uploadImgUrl: "",
      uploadVideoUrl: "",
      headers: {},
      customAttr: null,
      newImages: [], //编辑的时候新增加的图片，新增的时候新增加的图片
      attrs: [],
      boxradioIsShow: "",
      rules: {
        title: [{ required: true, message: "请输入商品标题", trigger: "blur" }],
        titleImg: [{ required: true, message: "请上传商品首图", trigger: "change" }],
        price: [
          { required: true, message: "请输入售价", trigger: "blur" },
          { validator: priceReg, trigger: "blur" },
        ],
        accountNumber: [
          { required: true, message: "请输入账号", trigger: "blur" },
        ],
        securityPhone: [{ validator: validatePass, trigger: "blur" }],
        costPrice: [{ validator: priceReg, trigger: "blur" }],
      },
      rules33: {
        yingdi: [
          { required: true, message: "请输入王者营地号", trigger: "change" },
        ],
      },

      backOrderId: "",
      xiaosuanLoading: null,
      fabuJingpai: false,
      shimingKey: "",
      refreshCost: "",
      isCanRefresh: false,
      routename: "",
      paramsId: "",
      paramsFlag: "",

      qufuTree: [], //区服树结构
      qufuProps: {
        value: "id",
        label: "fieldName",
        children: "childGameAttributes",
        expandTrigger: "hover",
      },

      yingdiDialogShow: false, //展示营地获取中间弹窗
      huoquData:null,//扫码获取的数据 ，获取后传到本字段，也许生成图用得到
      goodsSaleState:'',

      autoZibianhaoConfig:false,//自动生成自编号 是否开启
    };
  },
  created() {
    this.headers = {
      Authorization: "Bearer " + getToken(),
    };
    this.uploadImgUrl = process.env.VUE_APP_BASE_API + "/upload/image";
    this.uploadVideoUrl = process.env.VUE_APP_BASE_API + "/upload/video";
  },
  computed: {
    userInfo() {
      return this.$store.getters.userInfo;
    },
     shopInfo() {
      return this.$store.getters.shopInfo;
    },
    allGameList() {
      return this.$store.getters.allGameList;
    },
  },
  methods: {
    // 查询是否自动生成自编号 设置
    async getAutoZibianhao(){
      // 查询短信设置
      this.autoZibianhaoConfig = false
      const smsSetRes = await getConfigByTenantId({
          configKey: "autoZibianhao",
          tenantId: this.userInfo?this.userInfo.tenantId:'',
        })
        if (
        smsSetRes.data &&
        smsSetRes.data.configValue&&
        smsSetRes.data.configValue==1
        ){
          this.autoZibianhaoConfig = true
        }
    },




    // 扫码上传结束
    saomaEnd(e, key) {
      if (key == "titleImg" && e.length) {
        this.form.titleImg = e[0].url;
        this.titleImgList = [
          {
            ...e[0],
          },
        ];
      }
      if (key == "detailImg" && e.length) {
        e.forEach((r) => {
          this.imgFileList.push({
            name:'',
            url:r.url
          });
        });
      }
      if (key == "otherImg" && e.length) {
        e.forEach((r) => {
          this.otherImgList.push(r);
        });
      }
    },
    open(flag, id) {
      this.getAutoZibianhao()
      this.huoquData = null
      this.yingdiDialogShow = false;
      if (flag == "add" || flag == "backOrder" || flag == "jingpai") {
        this.$refs.addBeforeDialog.open(flag, id);
        this.paramsId = id;
        this.paramsFlag = flag;
      } else {
        this.openOld(flag, id);
      }
      
    },
    // 生成自编号
    makeZibianhao(){
      // 
      if(this.autoZibianhaoConfig){
        const chars = '12345ABCDEFGHJKLMNPQRSTUVWXYZ67890';
        const randomValues = new Uint8Array(6);
        crypto.getRandomValues(randomValues);
        let result = '';
        for (let i = 0; i < 6; i++) {
          result += chars[randomValues[i] % chars.length];
        }
        this.form.thirdId = result
      }
    },
    nextStep(formData) {
      // console.log("%c Line:402 🍊 formData", "color:#465975", formData);
      this.currentGame = {
        name: formData.gameName,
        id: formData.gameId,
        type: formData.gameType,
      };
      this.form = {
        ...this.form,
        ...formData,
      };
      if (this.paramsFlag != "backOrder") {
        // console.log(
        //   "%c Line:508 🧀 this.paramsFlag",
        //   "color:#f5ce50",
        //   this.paramsFlag
        // );
        const allData = JSON.parse(JSON.stringify(this.form));
        delete allData.title;
        delete allData.price;
        delete allData.accountNumber;
        delete allData.accountPassword;
        delete allData.securityPhone;
        delete allData.telid;
        delete allData.isMyTel;
        delete allData.telnote;
        delete allData.costPrice;
        delete allData.importantRemark;
        delete allData.titleImg;
        delete allData.urlArr;
        delete allData.videoUrl;
        delete allData.thirdId;
        delete allData.isTop;
        delete allData.ifself;
        delete allData.id;
        delete allData.otherImg;
        this.infoData = { ...allData, reset: true };
      }
      this.openOld();
    },
    async openOld(flag, id) {
      if (flag) this.paramsFlag = flag;
      if (id) this.paramsId = id;
      this.dialogVisible = true;
      this.routename = "";
      this.isCanRefresh = false;
      // const isGame = await this.getGameList();
      // if (!isGame) {
      //   return;
      // }
      this.shimingKey = "";
      this.$nextTick(() => {
        // window.removeEventListener("message", this.xiaosuanFn);
        this.fabuJingpai = false;
        this.isView = false;
        this.isEdit = false;
        this.isBackGoods = false;
        if (this.paramsFlag == "edit") {
          this.title = "修改商品信息";
          this.editGoodsStart(this.paramsId);
          this.getShuaxinYudou();
          this.isCanRefresh = true;
          return;
        } else if (this.paramsFlag == "view") {
          this.title = "查看商品信息";
          this.isEdit = false;
          this.isView = true;

          this.goodsId = this.paramsId;
          this.infoInputed = true;
          this.handleUpdate(this.paramsId);
        } else if (this.paramsFlag == "backOrder") {
          // 回收订单完成  发布商品
          this.title = "回收商品发布";
          this.isEdit = true;
          this.isBackGoods = true;
          this.huishouFabu(this.paramsId);
        } else if (this.paramsFlag == "jingpai") {
          //竞拍市场直接发布竞拍商品
          this.init();
          this.title = "发布竞拍商品";
          this.fabuJingpai = true;
        } else {
          this.init();
          this.title = "新增游戏账号";
          this.makeZibianhao()
        }
        // 营地发布的 授权获取 自动获取  王者荣耀 打开营地发布中间弹窗  扫码授权的打开授权码
        if (this.form.isAutoImg == 3) {
          this.form.yingdi = "";
          if (this.form.gameId == 2) {
            // 王者荣耀
            this.yingdiDialogShow = true;
          } else if (this.form.gameId == 29) {
            // 无畏契约
            this.yingdiDialogShow = true;
          } else if (this.form.gameId == 12) {
            // 永劫无间
            this.yingdiDialogShow = true;
            this.sendCOde = false;
            this.smsCode = "";
          } else if (this.form.gameId == 4) {
            // 永劫无间
            this.yingdiDialogShow = true;
            this.sendCOde = false;
            this.smsCode = "";
          } else {
            this.yingdiNext();
          }
        }
      });
    },
    // 打开中间页
    openZhongjianDialog() {
      if (this.form.gameId == 12) {
        // 永劫无间
        this.yingdiDialogShow = true;
        this.sendCOde = false;
        this.smsCode = "";
      }
    },
    // 永劫无间  获取手机号验证码
    async getSmsCode() {
      if (!this.phoneReg || !this.phoneReg.test(this.form.accountNumber)) {
        return this.$message.error("登录手机号不正确！");
      }
      try {
        this.sendCOde = true;
        let res;
        if (this.form.gameId == 12) {
          // 永劫无间
          res = await infoApi.ziYanYJWJphoneCode({
            account: this.form.accountNumber,
          });
        } else if (this.form.gameId == 4) {
          // 原神
          res = await infoApi.sendSmsYuanShen({
            mobile: this.form.accountNumber,
          });
        }

        if (res.code == 200) {
          this.$message.success("发送成功！");
        }
      } catch (error) {}
    },
    // 营地中间页  点击下一步
    async yingdiNext(flag) {
      if (this.form.gameId == 2) {
        // 王者荣耀
        if (!this.form.yingdi) {
          return this.$message.error("请输入王者营地号！");
        }
        this.yingdiDialogShow = false;
        this.$refs.releaseTool.yingdiNext(this.form.yingdi);
      } else if (this.form.gameId == 29) {
        // 无畏契约
        if (flag == 2) {
          // 扫码授权
          this.form.yingdi = "";
        } else {
          if (!this.form.yingdi) {
            return this.$message.error("请输入掌瓦号！");
          }
        }
        this.yingdiDialogShow = false;
        this.$refs.releaseTool.yingdiNext(this.form.yingdi);
      } else if (this.form.gameId == 12) {
        // 永劫无间
        if (this.form.serverId == 55615) {
          // 邮箱账号
          if (!this.form.accountNumber) {
            return this.$message.error("请输入游戏账号！");
          }
          if (!this.form.accountPassword) {
            return this.$message.error("请输入游戏密码！");
          }
          this.nextLoading = true;
          return this.$refs.releaseTool.yingdiNext({
            accountNumber: this.form.accountNumber,
            accountPassword: this.form.accountPassword,
          });
        }
        if (this.form.serverId == 96543) {
          // 手机账号
          if (!this.form.accountNumber) {
            return this.$message.error("请输入登录手机号！");
          }
          if (!this.smsCode) {
            return this.$message.error("请输入验证码！");
          }
          // 获取数据
          this.nextLoading = true;
          try {
            const gameData = await infoApi.ziYanYJWJphoneCodeGetData({
              account: this.form.accountNumber,
              smsCode: this.smsCode,
            });
            gameData;
            if (gameData.code == 200 && gameData.msg) {
              const result = JSON.parse(gameData.msg);
              // console.log("%c Line:710 🥔 result", "color:#ffdd4d", result);
              if (result.code == 200) {
                // 获取到数据  传给右侧组件
                this.nextLoading = false;
                this.yingdiDialogShow = false;
                return this.$refs.releaseTool.yingdiNext(gameData.msg);
              } else {
                this.$message.error(result.errmsg);
              }
            }
          } catch (error) {}
          this.nextLoading = false;
        }
      } else if (this.form.gameId == 4) {
        // 原神
        // 手机账号
        if (!this.form.accountNumber) {
          return this.$message.error("请输入登录手机号！");
        }
        if (!this.smsCode) {
          return this.$message.error("请输入验证码！");
        }
        // 获取数据
        this.nextLoading = true;
        try {
          const gameData = await infoApi.yuanshenSmsGetData({
            mobile: this.form.accountNumber,
            smsCode: this.smsCode,
          });
          if (gameData.code == 200 && gameData.msg) {
            const result = JSON.parse(gameData.msg);
            console.log("%c Line:710 🥔 result", "color:#ffdd4d", result);
            if (result.code === 0) {
              if (result.data && result.data.length) {
                // 获取到数据  传给右侧组件
                this.nextLoading = false;
                this.yingdiDialogShow = false;
                return this.$refs.releaseTool.yingdiNext(gameData.msg);
              } else {
                this.$message.error("未获取到账号信息！");
              }
            } else {
              this.$message.error(result.data);
            }
          }
        } catch (error) {}
        this.nextLoading = false;
      } else {
        this.yingdiDialogShow = false;
        this.$refs.releaseTool.yingdiNext(this.form.yingdi);
      }
    },
    // 获取游戏皮肤数据结束
    getAccountInfoEnd(flag,data) {
      this.yingdiDialogShow = false;
      this.nextLoading = false;
      if (flag == 1) {
        // 成功
        this.huoquData = data
        // this.yingdiDialogShow = false;
      } else {
        // 失败
      }
    },
    // 初始化页面，清空所有数据
    init() {
      // this.currentGame = this.gameList[0];
      // this.form.gameId = this.currentGame.id;
      // this.form.gameType = this.currentGame.type;
      // this.form.gameName = this.currentGame.name;
      // this.infoData.gameId = this.currentGame.id;
      // this.infoData.gameType = this.currentGame.type;
      // this.infoData.gameName = this.currentGame.name;
      // this.getAttrList();
      this.delPhone();
      this.isEdit = false;
    },
    // // 判断游戏是否为可快速发布的游戏
    // GetIsKuaiSu(id) {
    //   const kuaisuIds = [
    //     2, 5, 25, 6, 16, 10, 12, 37, 34, 29, 21, 8, 19, 4, 14, 11,
    //   ];
    //   return kuaisuIds.includes(id);
    // },
    //  获取刷新商品一次需要的虞豆
    getShuaxinYudou() {
      this.getDicts("points").then((res) => {
        if (res.data && res.data.length) {
          const obj = this.arrayToObject(res.data, "dictLabel");
          this.refreshCost = Math.abs(obj["refreshCost"].dictValue);
        }
      });
    },
    // 区服相关
    // 获取区服树结构
    getQufuTree(gameId) {
      this.qufuTree = [];
      let obj = {};
      obj.gameId = gameId || this.form.gameId;
      gameListApi.qufuTreeGetByGameId(obj).then((res) => {
        this.qufuTree = [...res.data];
      });
    },
    // 区服改变
    qufuChange(e) {
      // console.log("%c Line:220 🍐 e", "color:#33a5ff", e);
      this.form.systemName = "";
      this.form.carrierName = "";
      this.form.groupName = "";
      this.form.serverName = "";

      this.form.systemId = "";
      this.form.carrierId = "";
      this.form.groupId = "";
      this.form.serverId = "";
      if (!e || e.length == 0) {
      } else {
        this.getQufuForQufuIds();
      }
    },
    // 处理区服
    getQufuForQufuIds() {
      // 处理区服
      let qufu = "";
      if (this.form.gameType == 1) {
        // 端游
        this.qufuTree.forEach((daqu) => {
          if (daqu.id == this.form.qufuIds[0]) {
            qufu += daqu.fieldName;
            this.form.groupId = daqu.id;
            this.form.groupName = daqu.fieldName;
            if (daqu.childGameAttributes && daqu.childGameAttributes.length) {
              daqu.childGameAttributes.forEach((fu) => {
                if (fu.id == this.form.qufuIds[1]) {
                  qufu += fu.fieldName;
                  this.form.serverId = fu.id;
                  this.form.serverName = fu.fieldName;
                }
              });
            }
          }
        });
      } else {
        // 手游
        this.qufuTree.forEach((sys) => {
          if (sys.id == this.form.qufuIds[0]) {
            qufu += sys.fieldName;
            this.form.systemId = sys.id;
            this.form.systemName = sys.fieldName;
            if (sys.childGameAttributes && sys.childGameAttributes.length) {
              sys.childGameAttributes.forEach((carr) => {
                if (carr.id == this.form.qufuIds[1]) {
                  qufu += carr.fieldName;
                  this.form.carrierId = carr.id;
                  this.form.carrierName = carr.fieldName;
                  if (
                    carr.childGameAttributes &&
                    carr.childGameAttributes.length
                  ) {
                    carr.childGameAttributes.forEach((daqu) => {
                      if (daqu.id == this.form.qufuIds[2]) {
                        qufu += daqu.fieldName;
                        this.form.groupId = daqu.id;
                        this.form.groupName = daqu.fieldName;
                        if (
                          daqu.childGameAttributes &&
                          daqu.childGameAttributes.length
                        ) {
                          daqu.childGameAttributes.forEach((fu) => {
                            if (fu.id == this.form.qufuIds[3]) {
                              qufu += fu.fieldName;
                              this.form.serverId = fu.id;
                              this.form.serverName = fu.fieldName;
                            }
                          });
                        }
                      }
                    });
                  }
                }
              });
            }
          }
        });
      }
      this.form.qufu = qufu;
      // 通知右侧组件  区服更新
      this.$refs.releaseTool.updateQufu({
        systemId: this.form.systemId,
        systemName: this.form.systemName,
        carrierId: this.form.carrierId,
        carrierName: this.form.carrierName,
        groupId: this.form.groupId,
        groupName: this.form.groupName,
        serverId: this.form.serverId,
        serverName: this.form.serverName,
      });
      // this.GetIsKuaiSu(this.form.gameId)
    },
    // 区服相关 结束

    // 刷新商品排序
    shuaxinshangpin(id) {
      let that = this;
      return new Promise((resolve, reject) => {
        let baseServer = that.shopInfo&&that.shopInfo.baseServer
         let cont
      let tips =''
       let resdata 
      if(baseServer ==2) {
        cont = `<span style="color:#999;text-decoration: line-through;">${
            this.refreshCost || 0
          }</span>`
            resdata = `您已开通[基础服务包]，本次操作免费 `
      }else {
         cont = `<span style="color:red">${
          this.refreshCost || 0
        }</span> `
        tips = `<span>开通 <a style='color:#6c5dd3' @click='goLinkto'>基础服务包</a>后免虞豆</span>`
         resdata = `刷新商品会提升该商品的排名，不同步三方渠道；<br/>每次操作消耗 ${cont} 虞豆，是否继续？<br/>${tips} `
      }

        this.$confirm(
          `${resdata}`,
          "提示",
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "",
            dangerouslyUseHTMLString: true,
          }
        )
          .then(() => {
            this.loading = true;
            goodsListApi
              .goodsRefreshTime({ id: id })
              .then((res) => {
                this.loading = false;
                resolve();
                if (res.code == 200) {
                  this.$message({
                    type: "success",
                    message: "刷新成功!",
                  });
                } else {
                  this.$message({
                    type: "error",
                    message: res.msg,
                  });
                }
              })
              .catch((err) => {
                resolve();
                this.loading = false;
                if (err.code == 10000) {
                  // 虞豆不足
                  this.$message.error("虞豆不足，刷新失败");
                }
              });
          })
          .catch(() => {});

           // 弹窗打开后绑定事件
this.$nextTick(() => {
  const el = document.querySelector('.el-message-box__message a');
  if (el) {
    el.onclick = () => {
      this.goLinkto(); // 这里的 this 是 Vue 实例
      if (this.$msgbox && typeof this.$msgbox.close === 'function') {
        this.$msgbox.close();
      } else if (this.$messageBox && typeof this.$messageBox.close === 'function') {
        this.$messageBox.close();
      }
    };
  }
});

      });
      
    },
       goLinkto() {
    this.$router.push({
      path: "/jifenshangcheng",
    });
    },

    // 编辑功能开始，isEdit
    editGoodsStart(goodsId) {
      ////console.log("%c Line:388 🍒 goodsId", "color:#3f7cff", goodsId);
      // this.reset("edit");
      // this.infoData.reset = false;
      this.goodsId = goodsId;
      this.isEdit = true;
      this.infoInputed = true;

      this.handleUpdate(goodsId);
    },
    // 回收订单完成，发布商品  开始
    huishouFabu(tempData) {
      ////console.log("%c Line:388 🍒 goodsId", "color:#3f7cff", goodsId);
      this.backOrderId = tempData.backOrderId;
      // this.reset("edit");
      // this.infoData.reset = false;
      this.isEdit = true;
      this.infoInputed = true;
      // 解析回显的数据
      let allData = JSON.parse(tempData.goodsContent);
      allData.isAutoImg = this.form.isAutoImg;

      this.formatFields(allData, "back");
      this.getQufuTree(this.form.gameId);
      // this.getAttrList();
      this.makeZibianhao()
    },
    // 整理左侧字段和右侧字段
    formatFields(allData, flag) {
      // console.log("%c Line:875 🍯 allData", "color:#3f7cff", allData);
      let title = allData.title
        ? allData.title
        : allData.des
        ? allData.des.slice(0, 50)
        : "";
      title = title.replace(/\n/g, "");
      let obj = {
        title: title,
        price: allData.price,
        accountNumber: allData.accountNumber,
        accountPassword: allData.accountPassword,
        securityPhone: allData.securityPhone,
        telid: allData.telid,
        isMyTel: allData.isMyTel,
        telnote: allData.telnote,
        costPrice: allData.costPrice,
        importantRemark: allData.importantRemark,
        titleImg: allData.titleImg,
        urlArr: allData.urlArr,
        videoUrl: allData.videoUrl,
        thirdId: allData.thirdId,
        isTop: allData.isTop || 2,
        ifself: allData.ifself || 1,
        otherImg: allData.otherImg,
        dakuanImg: allData.dakuanImg,
        secondImg: allData.secondImg,
        walletImg: allData.walletImg,
      };
      if (flag != "back") {
        obj.gameId = allData.gameId;
        obj.gameType = allData.gameType;
        obj.gameName = allData.gameName;
        obj.systemId = allData.systemId || "";
        obj.systemName = allData.systemName || "";
        obj.carrierId = allData.carrierId || "";
        obj.carrierName = allData.carrierName || "";
        obj.groupId = allData.groupId || "";
        obj.groupName = allData.groupName || "";
        obj.serverId = allData.serverId || "";
        obj.serverName = allData.serverName || "";
      }

      delete allData.title;
      delete allData.price;
      delete allData.accountNumber;
      delete allData.accountPassword;
      delete allData.securityPhone;
      delete allData.telid;
      delete allData.isMyTel;
      delete allData.telnote;
      delete allData.costPrice;
      delete allData.importantRemark;
      delete allData.titleImg;
      delete allData.urlArr;
      delete allData.videoUrl;
      delete allData.thirdId;
      delete allData.isTop;
      delete allData.ifself;
      delete allData.otherImg;
      delete allData.dakuanImg;
      delete allData.secondImg;
      delete allData.walletImg;
      delete allData.saleState;

      if (flag == "edit") {
        obj.qufuIds =
          allData.gameType == 1
            ? [allData.groupId, allData.serverId]
            : [
                allData.systemId,
                allData.carrierId,
                allData.groupId,
                allData.serverId,
              ];
        obj.yingdi = "";
        this.form = obj;
      }
      if (flag == "back") {
        delete allData.id;
        this.form = { ...this.form, ...obj };
        allData.gameId = this.form.gameId;
        allData.gameType = this.form.gameType;
        allData.gameName = this.form.gameName;
        allData.systemId = this.form.systemId || "";
        allData.systemName = this.form.systemName || "";
        allData.carrierId = this.form.carrierId || "";
        allData.carrierName = this.form.carrierName || "";
        allData.groupId = this.form.groupId || "";
        allData.groupName = this.form.groupName || "";
        allData.serverId = this.form.serverId || "";
        allData.serverName = this.form.serverName || "";
      }
      this.allData = allData;
      if (obj.urlArr) {
        this.imgFileList = obj.urlArr;
      }
      if (obj.otherImg) {
        this.otherImgList = JSON.parse(obj.otherImg);
      }
      if (obj.titleImg) {
        this.titleImgList = [{ url: obj.titleImg, name: "" }];
      }
      let video = {};
      this.videoList = [];
      if (obj.videoUrl) {
        video.name = obj.videoName;
        video.url = obj.videoUrl;
        this.videoList[0] = video;
      }

      this.infoData = { ...this.allData, reset: true };
    },
    // 通知详情组件保存
    postInfoSave() {
      this.infoInputed = false;
      this.$refs.releaseTool.submitForm();
    },
    // attr改变
    attrChange(e) {
      this.attrs = e;
      // console.log("%c Line:384 🍓 this.attrs", "color:#ffdd4d", this.attrs);
    },
    // 获取详情填写页面传过来的数据
    getInfoData(e) {
      this.allData = JSON.parse(JSON.stringify(e));
      this.showReleasePage = false;
      this.infoInputed = true;
    },
    // 获取当前游戏的自定义属性
    // 获取游戏属性列表
    // async getAttrList() {
    //   this.loading = true;
    //   const res = await gameConfigApi.getGameConfig({
    //     gameId: this.form.gameId,
    //   });
    //   this.loading = false;
    //   if (res.code == 200) {
    //     let attrs = res.rows;
    //     this.attrs = JSON.parse(JSON.stringify(attrs));
    //   }
    // },
    // 打开选择手机弹窗
    openSelectPhone() {
      this.$refs.selectPhone.open(this.currentGame);
    },
    // 选择绑定手机
    async getSelectPhone(item) {
      if (item.zulinfangId) {
        // 租用的卡位
        this.form.isMyTel = 2;
        this.form.telid = item.telManageId;
        this.form.securityPhone = item.tel ? item.tel : "";
      } else {
        // 我的卡位
        this.form.telid = item.id;
        this.form.isMyTel = 1;
        this.form.securityPhone = item.tel ? item.tel : "";
      }
    },

    // 取消绑定手机
    delPhone() {
      this.selectedPhone = "";
      this.form.telid = "";
      this.form.telnote = "";
      this.form.securityPhone = "";
    },
    // 绑定的手机号输入框改变
    phoneNumberChange(e) {
      // console.log("%c Line:454 🥐 绑定的手机号输入框改变e", "color:#ffdd4d", e);
      this.form.telid = "";
      this.form.isMyTel = "";
    },
    // 关键字筛选游戏
    searchGame() {
      const str = this.keyword && this.keyword.trim();
      if (str) {
        this.gameList = this.AllgameList.filter((r) => {
          return r.name.includes(str);
        });
      } else {
        this.gameList = this.AllgameList;
      }
    },
    // 游戏列表
    async getGameList() {
      let res = await gameListApi.getCustomGamelist();
      // ////console.log("%c Line:278 🍫 res", "color:#465975", res);
      this.gameList = res.data;
      this.AllgameList = JSON.parse(JSON.stringify(res.data));
      if (this.AllgameList && this.AllgameList.length) {
        // this.currentGame = this.AllgameList[0];
        // this.form.gameId = this.AllgameList[0].id;
        // this.form.gameType = this.AllgameList[0].type;
        // this.form.gameName = this.AllgameList[0].name;
        // this.infoData.gameId = this.AllgameList[0].id;
        // this.infoData.gameType = this.AllgameList[0].type;
        // this.infoData.gameName = this.AllgameList[0].name;
        // this.getAttrList();
        return true;
      } else {
        this.$confirm("你还未设置游戏，是否立即设置游戏？", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            this.closeFn("GameSetting");
          })
          .catch(() => {
            this.closeFn();
          });
        return false;
      }
    },
    // 游戏类型切换
    // tabs切换时触发
    tabChange(e, item) {
      this.form.gameId = e;
      this.form.gameType = item.type;
      this.form.gameName = item.name;
      this.currentGame = item;
      this.infoData = {
        gameId: this.form.gameId,
        gameType: this.form.gameType,
        gameName: this.form.gameName,
      };
      this.infoInputed = false;
      // this.getAttrList();
    },

    // 重置
    reset(flag) {
      this.qufuTree = [];
      this.selectedPhone = "";
      this.$refs["form"].resetFields();
      this.form.titleImg = "";
      this.form.urlArr = null;
      this.form.title = null;
      this.form.dakuanImg = null;
      this.form.otherImg = null;
      this.form.videoUrl = null;

      this.imgFileList = [];
      // this.imgShowList = [];
      this.titleImgList = [];
      this.videoList = [];
      this.newImages = [];
      this.otherImgList = [];
      this.newOtherImages = [];
      this.attrs = [];
      this.allData = {};
      // if (flag != "edit") {
      //   this.infoData = {
      //     gameId: this.form.gameId,
      //     gameType: this.form.gameType,
      //     gameName: this.form.gameName,
      //     reset: true,
      //   };
      // }

      this.showReleasePage = false;
      this.infoInputed = false;
    },
    /** 查询详情进行回显 */
    handleUpdate(id) {
      // this.wzry = false;
      this.loading = true;
      goodsListApi.getGoodsDetail(id).then((response) => {
        this.loading = false;
        let allData = JSON.parse(JSON.stringify(response.data));
        this.goodsSaleState = allData.saleState
        allData.isAutoImg = 1;
        this.currentGame = {
          name: allData.gameName,
          id: allData.gameId,
          type: allData.gameType,
        };
        this.formatFields(allData, "edit");

        this.getQufuTree(this.form.gameId);
        // this.getAttrList();
      });
    },
    // 一键获取信息后  自动设置标题
    setTitle(e) {
      if (e && e.length) {
        const title = e.replace(/[\r\n]+/g, "").substr(0, 200);
        this.form.title = title;
      }
    },
    /** 一键生成主图 */
    async makeTitleImg() {
      // 处理所有的填写项
      let allForm = {};
      let form1 = JSON.parse(JSON.stringify(this.form));
      let form2 = JSON.parse(JSON.stringify(this.allData));
      allForm = {
        ...form1,
        ...form2,
      };
      // 处理多选项，拼接duoxuan详情的LIST
      let list = [];
      let img = "";
      let str = "";
      this.attrs.forEach((t) => {
        if (t.fieldType == "checkbox" || t.fieldType == "boxradio") {
          if (allForm[t.aavName]) {
            str = str + allForm[t.aavName] + ",";
          }
        }
      });

      // 生成
      let obj = JSON.parse(JSON.stringify(allForm));
      let list2 = JSON.parse(JSON.stringify(this.attrs));
      obj.shopName = this.$store.state.user.shopInfo.tenantName;
      img = await makeImgsV3.makeTitleImgStart(obj, str, list2,this.huoquData);
      return img;
    },
    /** 一键生成详情图 */
    async makeDetailImgs() {
      // 处理多选项，拼接duoxuan详情的LIST
      // 处理所有的填写项
      let allForm = {};
      let form1 = JSON.parse(JSON.stringify(this.form));
      let form2 = JSON.parse(JSON.stringify(this.allData));
      allForm = {
        ...form1,
        ...form2,
      };
      let list = [];
      let img = "";
      let str = "";
      this.attrs.forEach((t) => {
        if (t.fieldType == "checkbox") {
          if (allForm[t.aavName] && t.childAttributes) {
            for (let j = 0; j < t.childAttributes.length; j++) {
              let k = t.childAttributes[j];
              if (allForm[t.aavName].includes(k.id)) {
                list.push(k);
              }
            }
          }
        } else if (t.fieldType == "boxradio") {
          if (allForm[t.aavName] && t.childAttributes) {
            for (let j = 0; j < t.childAttributes.length; j++) {
              let k = t.childAttributes[j];
              if (k.childGameAttributes) {
                for (let l = 0; l < t.childGameAttributes.length; l++) {
                  let c = t.childGameAttributes[l];
                  if (allForm[t.aavName].includes(c.id)) {
                    list.push(c);
                  }
                }
              }
            }
          }
        }
      });
      // let res = await infoApi.getSelectList({
      //   ids: str
      // })
      // list = res.data
      // 生成
      img = await makeImgsV3.makeDetailImg(list);
      return img;
    },
    // 一键获取首图
    async openGetInfoDialog() {
      // 判断有没有填写详情
      await this.postInfoSave();
      if (!this.infoInputed) {
        return this.$message.error("请将右侧商品详情信息填写完整！");
      }
      this.makeTitleImgBtnLoading = true;
      let img = "";
      try {
        img = await this.makeTitleImg();
        this.makeTitleImgBtnLoading = false;
      } catch {
        this.makeTitleImgBtnLoading = false;
      }
      // 上传生成的base64图片
      if (img) {
        let titImg = this.base64ToBlob(img);
        // console.log("%c Line:1300 🍐 titImg", "color:#33a5ff", titImg);
        const resFile = await uploadFileFn(titImg, this.userInfo.tenantId);
        const imgUrl = qiniu.imageMogr2(
          {
            strip: true, // 布尔值，是否去除图片中的元信息
            quality: 90, // 图片质量，取值范围1-100
            format: "jpg", // 新图的输出格式，取值范围：jpg，gif，png，webp等
          },
          resFile.key,
          resFile.domain
        );
        this.form.titleImg = decodeURIComponent(imgUrl);
        this.titleImgList = [{ url: imgUrl, name: "" }];
      }
    },
    // 点击生成多张详情图 新版
    async getDetailImgsNew() {
      // 判断有没有填写详情
      await this.postInfoSave();
      if (!this.infoInputed) {
        return this.$message.error("请将右侧商品详情信息填写完整！");
      }
      // 处理多选项，拼接duoxuan详情的LIST
      // 处理所有的填写项
      let allForm = {};
      let form1 = JSON.parse(JSON.stringify(this.form));
      let form2 = JSON.parse(JSON.stringify(this.allData));
      allForm = {
        ...form1,
        ...form2,
      };
      let list = [{}];
      let arrInd = 0;
      this.attrs.forEach((t) => {
        if (t.fieldType == "checkbox" && t.isEnable === "0") {
          if (
            allForm[t.aavName] &&
            t.childAttributes &&
            (this.form.gameId != 29 ||
              (this.form.gameId == 29 && t.aavName != "f2"))
          ) {
            list[arrInd] = {
              list: [],
              name: t.fieldName,
            };
            for (let j = 0; j < t.childAttributes.length; j++) {
              const k = t.childAttributes[j];
              if (allForm[t.aavName].includes(k.id) && k.imgUrl) {
                list[arrInd].list.push(k);
              }
            }
            arrInd++;
          }
        } else if (t.fieldType == "boxradio" && t.isEnable === "0") {
          if (allForm[t.aavName] && t.childAttributes) {
            list[arrInd] = {
              list: [],
              name: t.fieldName,
            };
            for (let j = 0; j < t.childAttributes.length; j++) {
              let k = t.childAttributes[j];
              if (k.childGameAttributes) {
                for (let l = 0; l < t.childGameAttributes.length; l++) {
                  let c = t.childGameAttributes[l];
                  if (allForm[t.aavName].includes(c.id)) {
                    list[arrInd].list.push(c);
                  }
                }
              }
            }
            arrInd++;
          }
        }
      });
      this.makeDetailImgBtnLoading = true;
      allForm.shopName = this.$store.state.user.shopInfo.tenantName;
      let imgs = await makeImgsV3.makeDetailImgMultiple(
        allForm,
        list,
        this.attrs
      );
      for (let i = 0; i < imgs.length; i++) {
        // 上传生成的base64图片
        let detailImg = this.base64ToBlob(JSON.parse(imgs[i]));
        // let formData = new FormData();
        // formData.append("file", detailImg);
        const resFile = await uploadFileFn(detailImg, this.userInfo.tenantId);
        const imgUrl = qiniu.imageMogr2(
          {
            strip: true, // 布尔值，是否去除图片中的元信息
            quality: 90, // 图片质量，取值范围1-100
            format: "jpg", // 新图的输出格式，取值范围：jpg，gif，png，webp等
          },
          resFile.key,
          resFile.domain
        );
        this.imgFileList.push({ url: decodeURIComponent(imgUrl), name: "" });
      }
      this.makeDetailImgBtnLoading = false;
    },
    // 点击生成详情图
    async getDetailImgs() {
      // 判断有没有填写详情
      await this.postInfoSave();
      if (!this.infoInputed) {
        return this.$message.error("请将右侧商品详情信息填写完整！");
      }
      // 和平精英 英雄联盟 英雄联盟手游 无畏契约 王者荣耀
      if (
        this.form.gameId == 5 ||
        this.form.gameId == 29 ||
        this.form.gameId == 3 ||
        this.form.gameId == 6 ||
        this.form.gameId == 2 ||
        this.form.gameId == 25 ||
        this.form.gameId == 10 ||
        this.form.gameId == 12 ||
        this.form.gameId == 67||
        this.form.gameId == 8||
        this.form.gameId == 7
      ) {
        this.getDetailImgsNew();
      } else {
        this.makeDetailImgBtnLoading = true;
        let img = "";
        try {
          img = await this.makeDetailImgs();
          this.makeDetailImgBtnLoading = false;
        } catch {
          this.makeDetailImgBtnLoading = false;
        }
        // 上传生成的base64图片
        let detailImg = this.base64ToBlob(img);

        const resFile = await uploadFileFn(detailImg, this.userInfo.tenantId);
        const imgUrl = qiniu.imageMogr2(
          {
            strip: true, // 布尔值，是否去除图片中的元信息
            quality: 90, // 图片质量，取值范围1-100
            format: "jpg", // 新图的输出格式，取值范围：jpg，gif，png，webp等
          },
          resFile.key,
          resFile.domain
        );
        this.imgFileList.push({ url: decodeURIComponent(imgUrl), name: "" });
        // this.imgShowList.push({ url: res.msg, name: "" });
      }
    },
    // 图片转换
    base64ToBlob(code) {
      let parts = code.split(";base64,");
      let contentType = parts[0].split(":")[1];
      let raw = window.atob(parts[1]);
      let rawLength = raw.length;
      let uInt8Array = new Uint8Array(rawLength);

      for (let i = 0; i < rawLength; ++i) {
        uInt8Array[i] = raw.charCodeAt(i);
      }
      return new Blob([uInt8Array], { type: contentType });
    },
    // 上传视频前
    beforeUploadVideo(file) {
      if (file.size / 1024 / 1024 > 30) {
        this.$message.error("上传的视频不能超过30MB！请处理后再传！");
        return false;
      } else {
        return true;
      }
    },
    // 上传视频
    async uploadVideoFn(file) {
      //上传到后台
      this.videoLoading = true;
      try {
        const resFile = await uploadFileFn(file.file, this.userInfo.tenantId);
        file.data = {
          filePath: resFile.domain + resFile.key,
          fileName: resFile.key,
        };
        // file.data = {
        //   filePath: uploadImg.filePath,
        //   fileName: uploadImg.fileName,
        // };
        file.code = 200;
        this.videoLoading = false;
        return file;
      } catch {
        file.code = 500;
        this.videoLoading = false;
        return file;
      }
    },

    /**以下是图片上传相关 */
    // 限制图片大小
    beforeUploadImg(file) {
      if (file.size / 1024 / 1024 > 20) {
        this.$message.error("上传的图片不能超过20MB！请压缩后再传！");
        return false;
      } else {
        return true;
      }
    },
    uploadNumber(file, fileList) {
      //限制图片数量
      this.$modal.msgError("最多只能上传100张图片");
    },
    uploadNumber2(file, fileList) {
      //限制图片数量
      this.$modal.msgError("最多只能上传10张图片");
    },

    handleVideoSuccess(res, file) {
      // console.log("%c Line:857 🍤 res", "color:#ed9ec7", res);
      if (res.code == 200) {
        this.$set(this.form, "videoUrl", res.data.filePath);
        this.$set(this.form, "videoName", res.data.fileName);
      }
    },
    handleVideoRemove() {
      this.$set(this.form, "videoUrl", null);
      this.$set(this.form, "videoName", null);
    },

    // 其他图片上传成功
    otherUploadSuccess(res, file, fileList) {
      if (fileList.every((item) => item.status == "success")) {
        let tempArr = this.otherImgList.map((m) => {
          return m.url;
        });
        fileList.forEach((t) => {
          if (
            t.url.indexOf("blob:") > -1 &&
            t.response &&
            t.response.data &&
            t.response.data.filePath
          ) {
            if (!tempArr.includes(t.response.data.filePath)) {
              this.otherImgList.push({
                url: t.response.data.filePath,
                name: "",
              });
            }
            return true;
          }
        });
      }
    },
    //  其他图片删除
    otherImgRemove(item) {
      const that = this;
      // 1.获取将要删除图片的临时路径
      // const filePath = response.url;
      // 2.找到图片对应的索引值
      this.otherImgList.forEach(function (element, key) {
        if (element.url === item.url) {
          that.otherImgList.splice(key, 1); //回显的图片
        }
      });
      // this.imgShowList.forEach(function (element, key) {
      //   if (element.url === filePath) {
      //     that.imgShowList.splice(key, 1); //回显的图片
      //   }
      // });
      this.newOtherImages.forEach(function (element, key) {
        if (element.url === item.url) {
          that.newOtherImages.splice(key, 1); //新上传的图片
        }
      });
    },

    // 上传图片
    async uploadImgs(file) {
      // console.log("%c Line:466 🍆 压缩前file", "color:#2eafb0", file);
      // 获取压缩后的文件流
      let compreeBolb = await this.compressImage(file);
      // console.log(
      //   "%c Line:468 🎂 压缩后compreeBolb",
      //   "color:#33a5ff",
      //   compreeBolb
      // );
      // const formData = new FormData();
      // formData.append("file", compreeBolb); //压缩后的文件会自动转换成二进制文件流类型
      //上传图片到后台
      try {
        // let uploadImg = await postUpload(formData);
        const resFile = await uploadFileFn(compreeBolb, this.userInfo.tenantId);
        const imgUrl = qiniu.imageMogr2(
          {
            strip: true, // 布尔值，是否去除图片中的元信息
            quality: 90, // 图片质量，取值范围1-100
            format: "jpg", // 新图的输出格式，取值范围：jpg，gif，png，webp等
          },
          resFile.key,
          resFile.domain
        );
        file.data = {
          filePath: decodeURIComponent(imgUrl),
        };
        file.code = 200;
        return file;
      } catch {
        file.code = 500;
        return file;
      }
    },
    // 详情图片上传成功
    handleUploadSuccess(res, file, fileList) {
      console.log("%c Line:1764 🍅 res", "color:#ff9e6e", fileList);
      if (fileList.every((item) => item.status == "success")) {
        let tempArr = this.imgFileList.map((m) => {
          return m.url;
        });
        fileList.forEach((t) => {
          if (
            t.url.indexOf("blob:") > -1 &&
            t.response &&
            t.response.data &&
            t.response.data.filePath
          ) {
            if (!tempArr.includes(t.response.data.filePath)) {
              this.imgFileList.push({
                url: t.response.data.filePath,
                name: "",
              });
            }
            return true;
          }
        });
      }
    },
    // 详情图片删除
    handleRemove(url) {
      // console.log("%c Line:495 🍎 url", "color:#4fff4B", url);
      const that = this;
      // 1.获取将要删除图片的临时路径
      // const filePath = response.url;
      // 2.找到图片对应的索引值
      this.imgFileList.forEach(function (element, key) {
        if (element.url === url) {
          that.imgFileList.splice(key, 1); //回显的图片
        }
      });
      // this.imgShowList.forEach(function (element, key) {
      //   if (element.url === filePath) {
      //     that.imgShowList.splice(key, 1); //回显的图片
      //   }
      // });
      this.newImages.forEach(function (element, key) {
        if (element.url === url) {
          that.newImages.splice(key, 1); //新上传的图片
        }
      });
    },
    // 图片预览
    handlePictureCardPreview(file) {
      this.$viewerApi({
        images: [file.url],
      });
    },
    // 处理图片预览效果
    handlePreviewNew(index) {
      let arr = [];
      this.imgFileList.map((item) => {
        arr.push(item.url);
      });
      this.$viewerApi({
        images: arr,
        options: {
          initialViewIndex: index,
        },
      });
    },
    imgPreview(url) {
      this.$viewerApi({
        images: [url],
      });
    },
    // // 标题图片移除
    // handleAvatarRemove(response, file) {
    //   this.form.titleImg = "";
    //   this.titleImgList = [];
    // },
    // // 标题图片上传成功
    // handleAvatarSuccess(res, file) {
    //   if (res.code == 200) {
    //     let url = res.data.filePath;
    //     let name = res.data.fileName;
    //     let param = {};
    //     param.url = url;
    //     param.name = name;
    //     this.titleImgList.push(param);
    //     this.form.titleImg = res.data.filePath;
    //   }
    // },

    // 审核拒绝
    jujue(){
      // 输入拒绝原因
      this.$prompt("请输入拒绝原因", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        inputPattern: /\S/,
        inputErrorMessage: "请输入拒绝原因",
      })
        .then(({ value }) => {
          console.log("%c Line:1910 🍋 value", "color:#f5ce50", value);
          this.$confirm("是否确认拒绝编号为" + this.allData.id + '的商品？', "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }).then(async () => {
                  // 调用审核拒绝接口 goodsListApi.goodsJujue
                  console.log("%c Line:1914 🍇 goodsListApi.goodsJujue", "color:#33a5ff", goodsListApi.goodsJujue);
                  try {
                    const res = await goodsListApi.goodsJujue({
                      auditDes: value,
                      ids: [this.allData.id],
                    })
                    if(res.code==200){
                      this.$message.success('审核已拒绝！')
                    }
                  } catch (error) {
                    
                  }
                  



                  this.closeFn();
                  this.$parent.getList();
            }).catch(()=>{
              
            })
        })
        .catch(() => {});
    },

    // 提交
    submitForm(formName, flag) {
      this.$refs["form"].validate(async (valid) => {
        if (valid) {
          await this.postInfoSave();
          // 校验加入监控是否满足条件
          if (this.form.monitorTaskId) {
            let reg = new RegExp(/^[1-9][0-9]{4,10}$/);
            let reg2 = new RegExp(/^(1[0-9][0-9])\d{8}$/);
            let tel = "";
            tel = this.form.securityPhone;
            if (reg.test(this.form.accountNumber)) {
            } else {
              this.$alert(
                `您选择了加入监控，但是商品账号不是QQ号，请输入QQ账号或者不要选择加入监控！`
              );
              return;
            }
            if (reg2.test(tel)) {
            } else {
              this.$alert(
                `您选择了加入监控，但是未选择绑定手机号，请选择绑定手机号或者不要选择加入监控！`
              );
              return;
            }
          }
          if (!this.infoInputed) {
            this.$alert("请将右侧商品详情信息填写完整！");
            return;
          }
          if (this.isEdit && this.isCanRefresh && flag == 5) {
            await this.shuaxinshangpin(this.allData.id);
            return this.submitFormSure(formName, flag);
          }
          // 二次确认
          let tip = '确定发布该商品吗？'
          if(this.isEdit){
            if(flag!=4){
              tip = '确定修改该商品吗？'
              // 如果是审核拒绝的编辑  重新到待审核
              if(this.allData.saleState==98){
                this.allData.saleState = 0
                tip = '修改后重新审核，确定修改该商品吗？'
              }
            }
            if(flag==6){
              tip = '确定审核通过并保存修改内容吗？'
            }
          }
          this.$confirm(
            tip,
            "提示",
            {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            }
          )
            .then(async () => {
              
              if (this.isEdit && flag == 6) {
                await this.shenheTongguo(this.allData.id);
              }
              this.submitFormSure(formName, flag);
            })
            .catch(() => {});
        } else {
          this.$alert("请填写完整！");
        }
      });
    },
    // 审核通过
    async shenheTongguo(ids){
      this.loading = true;
      try {
        await goodsListApi.auditGoods(ids)
      } catch (error) {
        
      }
      this.loading = false;
    },
    // 发布到竞拍市场
    /**
     * 
     *    gameId: this.form.gameId,
					gameName: this.form.gameName,
					des: this.form.des,
					region: this.form.region,
					accountNumber: this.form.accountNumber,
					hopeAmount: this.form.hopeAmount,
					contactPhone: this.form.contactPhone,
					img: JSON.stringify(this.fileList1),
					goodsContent: JSON.stringify(goodsInfoAndAttrValueDto),
     * 
     */
    fabuToJingpai(obj) {
      //
      const imgs = [...obj.urlArr];
      if (obj.titleImg) {
        imgs.push({
          name: "",
          url: obj.titleImg,
        });
      }
      this.attrs.forEach((t) => {
        if (t.fieldKey == "sm") {
          // 实名字段
          this.shimingKey = t.aavName;
        }
      });

      const param = {
        gameId: obj.gameId,
        gameName: obj.gameName,
        des: obj.des,
        region:
          obj.gameType == 1
            ? obj.groupName + obj.serverName
            : obj.systemName + obj.carrierName,
        accountNumber: obj.accountNumber,
        hopeAmount: "",
        contactPhone: obj.securityPhone,
        img: JSON.stringify(imgs),
        goodsContent: JSON.stringify(obj),
      };
      if (this.shimingKey) {
        // 找出实名状态
        param.relname = obj[this.shimingKey + "name"];
      }
      goodsListApi.addGoodsToJingpai(param).then((response) => {
        this.$modal.msgSuccess("发布成功");
        this.attrs = [];
        this.$emit("success");
        this.closeFn();
      });
    },
    // 发布或修改确认
    submitFormSure(formName, flag) {
      // 拼接新上传的图片 this.newImages
      // console.log(
      //   "%c Line:921 🥝 this.newImages",
      //   "color:#ffdd4d",
      //   this.newImages
      // );
      let imgFileList = []
      if(this.imgFileList&&this.imgFileList.length){
        this.imgFileList.forEach(img=>{
          imgFileList.push({
            name:'',
            url:img.url
          })
        })
      }
      if (this.newImages && this.newImages.length) {
        let newArr = [];
        this.newImages.forEach((img) => {
          newArr.push({
            name: img.name,
            url: img.response.data.filePath,
          });
        });
        this.form.urlArr = imgFileList.concat(newArr);
      } else {
        this.form.urlArr = imgFileList;
      }
      // 处理其他图片
      if (this.newOtherImages && this.newOtherImages.length) {
        let newArr = [];
        this.newOtherImages.forEach((img) => {
          newArr.push({
            name: img.name,
            url: img.response.data.filePath,
          });
        });
        this.form.otherImg = JSON.stringify(this.otherImgList.concat(newArr));
      } else {
        this.form.otherImg = JSON.stringify(this.otherImgList);
      }
      // return
      let obj = {
        ...this.form,
        ...this.allData,
      };
      // 去除账号两端空格
      if(obj.accountNumber) obj.accountNumber = obj.accountNumber.trim()
      if(obj.accountPassword) obj.accountPassword = obj.accountPassword.trim()
      if (this.fabuJingpai) {
        return this.fabuToJingpai(obj);
      }
      
      if (this.isEdit) {
        // 编辑
        if (flag == 3) {
          //回收商品 保存
          const obj2 = {
            id: this.backOrderId,
            goodsHandle: 1,
            goodsContent: JSON.stringify(obj),
          };
          goodsListApi.backClueOrderGoodsSave(obj2).then((response) => {
            // this.$modal.msgSuccess("编辑成功");
            this.attrs = [];
            this.closeFn();
            // 成功后提示
            this.$alert("保存商品成功！", "提示", {
              confirmButtonText: "确定",
              callback: (action) => {
                this.$parent.getList();
              },
            });
          });
        } else if (flag == 4) {
          //回收商品 发布
          if (obj.price == 0 || !obj.price) {
            this.$confirm(`当前商品价格为 0 ，确认继续发布吗？`, "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            })
              .then(() => {
                const obj2 = {
                  id: this.backOrderId,
                  goodsHandle: 2,
                  goodsContent: JSON.stringify(obj),
                };
                goodsListApi.backClueOrderGoodsSave(obj2).then((response) => {
                  // this.$modal.msgSuccess("编辑成功");
                  this.attrs = [];

                  // 成功后提示
                  this.closeFn();
                  this.$alert(
                    "发布商品成功，请在商品审核菜单进行审核上架！",
                    "提示",
                    {
                      confirmButtonText: "确定",
                      callback: (action) => {
                        this.$parent.getList();
                      },
                    }
                  );
                });
              })
              .catch(() => {});
          } else {
            const obj2 = {
              id: this.backOrderId,
              goodsHandle: 2,
              goodsContent: JSON.stringify(obj),
            };
            goodsListApi.backClueOrderGoodsSave(obj2).then((response) => {
              // this.$modal.msgSuccess("编辑成功");
              this.attrs = [];
              // 成功后提示
              this.closeFn();
              this.$alert(
                "发布商品成功，请在商品审核菜单进行审核上架！",
                "提示",
                {
                  confirmButtonText: "确定",
                  callback: (action) => {
                    this.$parent.getList();
                  },
                }
              );
            });
          }
        } else {
          // 正常编辑
          if (obj.price == 0 || !obj.price) {
            this.$confirm(`当前商品价格为 0 ，确认继续发布吗？`, "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            })
              .then(() => {
                goodsListApi.editGoods(obj).then((response) => {
                  // this.$modal.msgSuccess("编辑成功");
                  this.attrs = [];
                  // 成功后提示
                  this.closeFn();
                  this.$alert("修改商品成功！", "提示", {
                    confirmButtonText: "确定",
                    callback: (action) => {
                      this.$emit("success");
                    },
                  });
                });
              })
              .catch(() => {});
          } else {
            goodsListApi.editGoods(obj).then((response) => {
              // this.$modal.msgSuccess("编辑成功");
              this.attrs = [];
              // 成功后提示
              this.closeFn();
              this.$alert("修改商品成功！", "提示", {
                confirmButtonText: "确定",
                callback: (action) => {
                  this.$emit("success");
                },
              });
            });
          }
        }
      } else {
        // 正常发布
        // 对接小算自动截图 obj
        // console.log("%c Line:1210 🌰 obj", "color:#ea7e5c", obj);

        if (obj.isAutoImg == 2) {
          // 判断是否填写密码
          if (
            !this.form.accountPassword ||
            this.form.accountPassword.trim() == ""
          ) {
            return this.$message.error("请填写账号登录密码！");
          }
          const xiaosuan = document.getElementById("xiaosuan").contentWindow;
          const data = {
            user: this.form.accountNumber,
            pwd: this.form.accountPassword,
            gameId: "10033",
            gamePlatform: "qq",
            actionType: "login",
            channel: "yxf_client",
          };
          if (this.form.gameId == 2) {
            //王者
            data.gamePlatform = "qq";
            data.gameId = "10034";
          }
          if (this.form.gameId == 3) {
            //和平
            data.gamePlatform = "qq";
            data.gameId = "10043";
          }
          if (this.form.gameId == 12) {
            //永劫无间
            data.gamePlatform = "netease_dashen";
            data.gameId = "10128";
          } else if (this.form.gameId == 34) {
            //暗区突围
            data.gamePlatform = "qq";
            data.gameId = "10078";
          } else if (this.form.gameId == 8) {
            //枪战王者
            data.gamePlatform = "qq";
            data.gameId = "10069";
          } else if (this.form.gameId == 19) {
            //使命召唤 手游
            data.gamePlatform = "qq";
            data.gameId = "10197";
          } else if (this.form.gameId == 4) {
            //原神
            data.gamePlatform = "mihoyo";
            if (this.form.carrierId == "41550") {
              data.gamePlatform = "bilibili";
            }

            data.gameId = "10031";
          } else if (this.form.gameId == 14) {
            //QQ飞车 手游
            data.gamePlatform = "qq";
            data.gameId = "10200";
          } else if (
            this.form.gameId == 37 ||
            this.form.gameId == 21 ||
            this.form.gameId == 11||
            this.form.gameId == 73
          ) {
            //永劫无间手游  第五人格 光遇 无需验号  直接提交
            return this.commitNow(obj);
          } else if (this.form.gameId == 67) {
            //三角洲
            data.gamePlatform = "qq";
            data.gameId = "10181";
          }
          // 验号信息 data
          console.log("%c Line:1694 🍪验号信息 data", "color:#3f7cff", data);
          console.log("%c Line:1694  form", "color:#3f7cff", this.form);
          xiaosuan.postMessage(data, "*"); //开始验号
          // console.log("%c Line:1696 🥖 xiaosuan", "color:#33a5ff", xiaosuan);
          this.xiaosuanLoading = this.$loading({
            lock: true,
            text: "账号验证中,请耐心等待...",
            spinner: "el-icon-loading",
            color: "#fff",
            background: "rgba(0, 0, 0, 0.7)",
          });
          // window.removeEventListener("message", this.xiaosuanFn);
          let _this = this;
          window.addEventListener("message", function xiaosuanFn(e) {
            // console.log("%c Line:1706 🥒小算返回 e", "color:#33a5ff", e);
            let data = e.data; //返回结果
            let origin = e.origin; //返回的域名
            let isYanzhengma = false;
            if (origin == "https://rpa-sdk.51bees.com" && !!data.actionType) {
              console.log(
                "%c Line:1340 🍖小算返回 data",
                "color:#33a5ff",
                data
              );
              if (data.actionType == "data") {
                window.removeEventListener("message", xiaosuanFn);
                //data 返回的数据 结果数据
                if (data.data.code == 3001) {
                  _this.$message.success("验号通过");
                  // 验号通过
                  _this.commitNow(obj);
                } else {
                  if (data.data.code == 3011) {
                    if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
                    _this.$message.error("获取验证码超时");
                  } else if (data.data.code == 3005) {
                    if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
                    _this.$message.error("获取验证码超时 耗时:180s");
                  } else {
                    if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
                    _this.$message.error(
                      data.data.message || "游戏账号和密码不匹配！"
                    );
                  }
                }
              } else if (data.actionType == "VerifyCode" && !isYanzhengma) {
                //通知获取短信显示
                isYanzhengma = true;
                if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
                _this
                  .$prompt("请输入你收到的短信验证码", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    closeOnClickModal: false,
                  })
                  .then(({ value }) => {
                    const data = {
                      user: _this.form.accountNumber,
                      pwd: _this.form.accountPassword,
                      gameId: "10033",
                      gamePlatform: "qq",
                      actionType: "verifyCode",
                      channel: "yxf_client",
                      verifyCode: value,
                    };
                    if (_this.form.gameId == 2) {
                      //王者
                      data.gamePlatform = "qq";
                      data.gameId = "10034";
                    }
                    if (_this.form.gameId == 3) {
                      //和平
                      data.gamePlatform = "qq";
                      data.gameId = "10043";
                    }
                    if (_this.form.gameId == 12) {
                      //永劫无间
                      data.gamePlatform = "netease_dashen";
                      data.gameId = "10128";
                    } else if (_this.form.gameId == 34) {
                      // 暗区突围
                      data.gamePlatform = "qq";
                      data.gameId = "10078";
                    } else if (_this.form.gameId == 8) {
                      // 暗区突围
                      data.gamePlatform = "qq";
                      data.gameId = "10069";
                    } else if (_this.form.gameId == 19) {
                      // 暗区突围
                      data.gamePlatform = "qq";
                      data.gameId = "10197";
                    } else if (_this.form.gameId == 4) {
                      //原神
                      data.gamePlatform = "mihoyo";
                      if (_this.form.carrierId == "41550") {
                        data.gamePlatform = "bilibili";
                      }
                      data.gameId = "10031";
                    } else if (_this.form.gameId == 14) {
                      //QQ飞车 手游
                      data.gamePlatform = "qq";
                      data.gameId = "10200";
                    } else if (_this.form.gameId == 67) {
                      //三角洲
                      data.gamePlatform = "qq";
                      data.gameId = "10181";
                    }
                    // data
                    console.log(
                      "%c Line:1785 🥛输入验证码进行验证 data",
                      "color:#6ec1c2",
                      data
                    );
                    isYanzhengma = false;
                    xiaosuan.postMessage(data, "*"); //开始验号
                    _this.xiaosuanLoading = _this.$loading({
                      lock: true,
                      text: "账号验证中,请耐心等待...",
                      color: "#fff",
                      spinner: "el-icon-loading",
                      background: "rgba(0, 0, 0, 0.7)",
                    });
                  })
                  .catch(() => {});
              } else if (data.actionType == "slider") {
                // console.log("%c Line:1340 🍖小算返回 data","color:#33a5ff", data);
                window.removeEventListener("message", xiaosuanFn);
                //qq滑块显示
              } else if (data.actionType == "sliderEnd") {
                window.removeEventListener("message", xiaosuanFn);
                //qq滑块结束
              } else if (data.actionType == "submitHide") {
                window.removeEventListener("message", xiaosuanFn);
                //提交隐藏
              } else if (data.actionType == "closeSubmitHide") {
                window.removeEventListener("message", xiaosuanFn);
                //关闭隐藏
              } else {
                window.removeEventListener("message", xiaosuanFn);
              }
            }
          });
        } else {
          if (obj.price == 0 || !obj.price) {
            this.$confirm(`当前商品价格为 0 ，确认继续发布吗？`, "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            })
              .then(() => {
                goodsListApi.addGoods(obj).then((response) => {
                  this.$modal.msgSuccess("新增成功");
                  this.attrs = [];
                  this.$emit("success");
                  this.closeFn();
                });
              })
              .catch(() => {});
          } else {
            goodsListApi.addGoods(obj).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.attrs = [];
              this.$emit("success");
              this.closeFn();
            });
          }
        }
      }
    },
    xiaosuanFn(e, obj) {
      let _this = this;
      let data = e.data; //返回结果
      console.log("%c Line:1225 🥃EventListener data", "color:#f5ce50", data);
      let origin = e.origin; //返回的域名
      if (origin == "https://rpa-sdk.51bees.com" && !!data.actionType) {
        if (data.actionType == "data") {
          //data 返回的数据 结果数据
          if (data.data.code == 3001) {
            _this.$message.success("验号通过");
            // 验号通过
            goodsListApi.addGoods(obj).then((response) => {
              if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
              if (response.code == 10000) {
                // 虞豆不足
                _this.$refs.chongzhi.open();
                return;
              }
              _this.$modal.msgSuccess("新增成功");
              _this.attrs = [];
              _this.$emit("success");
              _this.closeFn();
              _this.$store.dispatch("getShopInfo");
            });
          } else {
            if (data.data.code == 3011) {
              if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
              _this.$message.error("获取验证码超时");
            } else {
              if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
              _this.$message.error("游戏账号和密码不匹配！");
            }
          }
        } else if (data.actionType == "VerifyCode") {
          //通知获取短信显示
          if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
          _this
            .$prompt("请输入你收到的短信验证码", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              closeOnClickModal: false,
            })
            .then(({ value }) => {
              const data = {
                user: _this.form.accountNumber,
                pwd: _this.form.accountPassword,
                gameId: "10033",
                gamePlatform: "qq",
                actionType: "verifyCode",
                channel: "yxf_client",
                verifyCode: value,
              };
              if (_this.form.gameId == 12) {
                //永劫无间
                data.gamePlatform = "netease_dashen";
                data.gameId = "10128";
              }
              xiaosuan.postMessage(data, "*"); //开始验号
              _this.xiaosuanLoading = _this.$loading({
                lock: true,
                text: "账号验证中,请耐心等待...",
                color: "#fff",
                spinner: "el-icon-loading",
                background: "rgba(0, 0, 0, 0.7)",
              });
            })
            .catch(() => {});
        } else if (data.actionType == "slider") {
          //qq滑块显示
        } else if (data.actionType == "sliderEnd") {
          //qq滑块结束
        } else if (data.actionType == "submitHide") {
          //提交隐藏
        } else if (data.actionType == "closeSubmitHide") {
          //关闭隐藏
        }
      }
    },
    // 直接提交
    commitNow(obj) {
      goodsListApi.addGoods(obj).then((response) => {
        if (this.xiaosuanLoading) this.xiaosuanLoading.close();
        if (response.code == 10000) {
          // 虞豆不足
          this.$refs.chongzhi.open();
          return;
        }
        this.$modal.msgSuccess("新增成功");
        this.attrs = [];
        this.$emit("success");
        this.closeFn();
        this.$store.dispatch("getShopInfo");
      });
    },
    //回收商品 保存
    // backGoodSave(){

    // },
    closeFn(routename) {
      if (routename) this.routename = routename;
      this.dialogVisible = false;
      // close()
    },
    close() {
      // 关闭了弹窗
      this.reset();
      this.btnLoading = false;
      this.makeTitleImgBtnLoading = false;
      this.makeDetailImgBtnLoading = false;

      if (this.routename) {
        this.$emit("close", this.routename);
      } else {
        this.$emit("close");
      }
      if (this.dialogVisible);
    },
    // 单张图片上传成功
    uploadSucccess(e, key) {
      this.form[key] = e;
    },
  },
};
</script>
<style scoped lang="scss">
.ceshifont {
  font-family: myFontruihei5;
}
.add-edit-box {
  position: relative;
  height: calc(100% - 30px);
  > .flex {
    height: 100%;
  }
  .game-box {
    flex-wrap: wrap;

    .select-game-item {
      width: 60px;
      text-align: center;
      color: #666;
      font-size: 12px;
      margin-right: 5px;
      margin-bottom: 8px;
      cursor: pointer;

      overflow: hidden;
      .img {
        width: 50px;
        height: 50px;
        border-radius: 8px;
        overflow: hidden;
        position: relative;
        margin: 0 auto;

        img {
          width: 100%;
          height: 100%;
        }
      }
      &.active {
        color: #6c5dd3;
        font-weight: bold;
      }
      .sign {
        width: 50px;
        height: 20px;
        line-height: 22px;
        text-align: center;
        font-size: 11px;
        background-color: #6c5dd3;
        color: #fff;
        position: absolute;
        top: -2px;
        left: -16px;
        transform: rotate(-45deg);
      }
    }
  }
}
.center {
  // text-align: center;
  // width: 100%;
  // padding: 10px 0;
  padding-top: 10px;
  // margin-top: 10px;
  // box-shadow: 0 0 4px 1px rgba(0,0,0,0.1);
  border-top: 1px solid #f3f3f3;
  .el-button {
    width: 200px;
    height: 36px;
  }
}

.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}

.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}

.avatar {
  width: 178px;
  height: 178px;
  display: block;
}

.boxradioitem {
  padding: 15px;
  border: 1px dashed #999;
  border-radius: 10px;
}

// .el-radio {
//   display: block;
//   line-height: 22px;
// }

// .boxradioRadioBox {
//   background: #fff;
//   box-shadow: 0 0 7px #e3e3e3;
//   padding: 10px;
//   position: absolute;
//   z-index: 99;
//   left: 20px;
//   top: 30px;
//   display: none;
// }

// .boxradioRadioBox.show {
//   display: block;
// }

// ::v-deep .form-box .el-upload-dragger {
//   width: $uploadWidth;
//   height: $uploadHeight;
//   border: none;
// }
// ::v-deep .form-box .el-upload--picture-card {
//   width: $uploadWidth;
//   height: $uploadHeight;
//   border: none;
// }
// ::v-deep .form-box .el-upload-list--picture-card .el-upload-list__item {
//   width: $uploadWidth;
//   height: $uploadHeight;
// }

.step-box {
  width: 100%;
  // padding: 10px;
  background-color: $fff;
  // margin-bottom: 16px;
}

.sub-tit {
  margin-bottom: 15px;
}
.yitian {
  color: $green;
  margin-left: 10px;
  cursor: pointer;
}
.weitian {
  color: $yellow;
  margin: 0 10px;
  cursor: pointer;
}
// .uploadbg {
//   width: $uploadWidth;
//   height: $uploadHeight;
// }
.video-view {
  width: 280px;
  height: 150px;
  // position: relative;
  // background: #409eff;
  align-items: flex-start;
  .el-icon-delete {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    font-size: 20px;
    margin-left: 10px;
    color: #666;
    cursor: pointer;
    // &:hover {
    //   color: $primary;
    // }
    // color: $fff;
  }
  video {
    width: 280px;
    height: 150px;
    border-radius: 10px;
  }
}
.phone-box {
  margin-left: 15px;
  align-items: center;

  .name {
    white-space: nowrap;
    width: 90px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
.release-page {
  // height: 100%;
  // overflow-y: auto;
  // position: absolute;
  // top: 0;
  // left: 0;
}
.add_dialog ::v-deep .el-dialog__body {
  height: calc(100vh - 60px) !important;
  max-height: calc(100vh - 50px) !important;
}
// ::v-deep .saoma .el-dialog__body {
//   height: 800px !important;
//   max-height: calc(100vh - 50px) !important;
// }
.form-box {
  width: 40%;
  min-width: 650px;
  flex-shrink: 0;
  height: 100%;
  overflow-y: auto;
  padding-right: 15px;
  box-sizing: border-box;
  border-right: 1px solid #f3f3f3;
}
.release-page {
  width: 100%;
  height: 100%;
  overflow-y: auto;
  box-sizing: border-box;
}

.uploader {
  display: flex;
  // align-items: center;
  flex-wrap: wrap;

  .upload-list {
    margin-right: 10px;
    margin-bottom: 10px;
    width: 100px;
    height: 100px;
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid #eee;
    position: relative;

    &:hover {
      .icon-container {
        display: block;
        transition: all 0.5s;
      }
    }

    .icon-container {
      position: absolute;
      display: none;
      transition: all 0.5s;
      width: 100%;
      height: 100%;
      line-height: 100px;
      color: #fff;
      font-size: 20px;
      text-align: center;
      border-radius: 8px;
      top: 0;
      left: 0;
      background-color: rgba(0, 0, 0, 0.5);
      cursor: pointer;

      span {
        margin: 0 10px;
        cursor: pointer;
      }
    }
  }

  .imgs {
    position: absolute;
    top: 0;
    right: 0;
  }
}

::v-deep .el-dialog__body {
  padding-top: 10px !important;
}
::v-deep .upload_img_box .el-form-item {
  width: 200px !important;
}
</style>
